﻿<!DOCTYPE html>
<!--[if lt IE 9 ]> <html lang="en" dir="ltr" class=" ie-old"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" dir="ltr" class=" ie9"> <![endif]-->
<!--[if IE 10 ]> <html lang="en" dir="ltr" class=" ie10"> <![endif]-->
<!--[if (gt IE 10)|!(IE)]><!-->
<html lang="en" dir="ltr"  xmlns:th="http://www.thymeleaf.org"
      xmlns:vertical-align="http://www.w3.org/1999/xhtml" xmlns:http="http://www.w3.org/1999/xhtml">
<!--<![endif]-->

<head>
    <div th:replace="commons/public_head :: common_resource"></div>
    <title>FRIDAY | Coupons, Deals, Discounts and Promo codes Template</title>
</head>

<body id="body" class="wide-layout preloader-active">

     



    <!--[if lt IE 9]>
        <p class="browserupgrade alert-error">
        	You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.
        </p>
    <![endif]-->

    <noscript>
        <div class="noscript alert-error">
            For full functionality of this site it is necessary to enable JavaScript. Here are the <a href="http://www.enable-javascript.com/" target="_blank">
		 instructions how to enable JavaScript in your web browser</a>.
        </div>
    </noscript>

    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- PRELOADER                                 -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- Preloader -->
    <div id="preloader" class="preloader">
        <div class="loader-cube">
            <div class="loader-cube__item1 loader-cube__item"></div>
            <div class="loader-cube__item2 loader-cube__item"></div>
            <div class="loader-cube__item4 loader-cube__item"></div>
            <div class="loader-cube__item3 loader-cube__item"></div>
        </div>
    </div>
    <!-- End Preloader -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- WRAPPER                                   -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <div id="pageWrapper" class="page-wrapper">
        <!-- –––––––––––––––[ HEADER ]––––––––––––––– -->
        <div th:replace="commons/header::public_header"></div>
        <!-- –––––––––––––––[ HEADER ]––––––––––––––– -->

        <!-- –––––––––––––––[ PAGE CONTENT ]––––––––––––––– -->
        <main id="mainContent" class="main-content">
            <div class="page-container ptb-60">
                <div class="container">
                    <section class="sign-area panel p-40">
                        <h3 class="sign-title">注册 <small>Or <a th:href="@{/users/login}" class="color-green">登录</a></small></h3>
                        <div class="row row-rl-0">
                            <div class="col-sm-6 col-md-7 col-left">
                                <form class="p-40" th:action="@{/users/registerfirst}"  method="post" th:object="${user}">
                                    <input type="hidden" id="errorMsg" th:value="${errorMsg}">
                                    <div class="form-group">
                                        <label class="sr-only">Full Name</label>
                                        <input required="true" type="text" id="username" name="username" class="form-control input-lg" th:placeholder="${errorMsg}">
                                    </div>
                                    <div class="form-group">
                                        <label class="sr-only">Email</label>
                                        <input required="true" type="text" id="email" name="email" class="form-control input-lg" th:placeholder="${errorEmailMsg}">
                                    </div>
                                    <div class="form-group">
                                        <label class="sr-only">Password</label>
                                        <input required="true" type="password" id="password" name="password" class="form-control input-lg" th:placeholder="${errorPasswordMsg}">
                                    </div>
                                    <div class="form-group">
                                        <label class="sr-only">Confirm Password</label>
                                        <input required="true" type="password" id="repassword" name="repassword"  class="form-control input-lg" placeholder="再次输入密码">
                                    </div>

                                    <div class="form-group">
                                        <label class="sr-only">Confirm Password</label>
                                        <input required="true" type="text" class="form-control" id="telephone"
                                               name="telephone" placeholder="联系方式">
                                    </div>
                                    <button type="submit" id="register" class="btn btn-block btn-lg">注册</button>
                                </form>
                            </div>
                            <div class="col-sm-6 col-md-5 col-right">
                                <div class="social-login p-40">
                                    <div class="text-center color-mid">
                                        已经注册过账号? <a th:href="@{/users/login}" class="color-green">登录</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>
                </div>
            </div>


        </main>
        <!-- –––––––––––––––[ END PAGE CONTENT ]––––––––––––––– -->
        <section class="footer-top-area pt-70 pb-30 pos-r bg-blue">
            <div class="container">
                <div class="row row-tb-20">
                    <div class="col-sm-12 col-md-7">
                        <div class="row row-tb-20">
                            <div class="footer-col col-sm-6">
                                <div class="footer-about">
                                    <img class="mb-40" th:src="@{/assets/images/logo_light.png}" width="250" alt="">
                                    <p class="color-light">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam dolores quidem mollitia id ipsa nisi necessitatibus iure repudiandae aperiam, odit ipsam dolor fugiat corporis nesciunt illo nemo minus.</p>
                                </div>
                            </div>
                            <div class="footer-col col-sm-6">
                                <div class="footer-top-twitter">
                                    <h2 class="color-lighter">Twitter Feed</h2>
                                    <ul class="twitter-list">
                                        <li class="single-twitter">
                                            <p class="color-light"><i class="ico fa fa-twitter"></i><a href="#">@masum_rana :</a> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore in reprehenderit.</p>
                                        </li>
                                        <li class="single-twitter">
                                            <p class="color-light"><i class="ico fa fa-twitter"></i><a href="#">@masum_rana :</a> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione id corrupti iusto cupiditate omnis.</p>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-5">
                        <div class="row row-tb-20">
                            <div class="footer-col col-sm-6">
                                <div class="footer-links">
                                    <h2 class="color-lighter">Quick Links</h2>
                                    <ul>
                                        <li><a href="deals_grid.html">Latest Deals</a>
                                        </li>
                                        <li><a href="coupons_grid.html">Newest Coupons</a>
                                        </li>
                                        <li><a href="contact_us_02.html">Contact Us</a>
                                        </li>
                                        <li><a href="404.html">Error 404</a>
                                        </li>
                                        <li><a href="terms_conditions.html">Terms of Use</a>
                                        </li>
                                        <li><a href="faq.html">FAQs</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="footer-col col-sm-6">
                                <div class="footer-top-instagram instagram-widget">
                                    <h2>Instagram Widget</h2>
                                    <div class="row row-tb-5 row-rl-5">


                                        <div class="instagram-widget__item col-xs-4">
                                            <img th:src="@{/assets/images/instagram/instagram_01.jpg}" alt="">
                                        </div>


                                        <div class="instagram-widget__item col-xs-4">
                                            <img th:src="@{/assets/images/instagram/instagram_02.jpg}" alt="">
                                        </div>


                                        <div class="instagram-widget__item col-xs-4">
                                            <img th:src="@{/assets/images/instagram/instagram_03.jpg}" alt="">
                                        </div>


                                        <div class="instagram-widget__item col-xs-4">
                                            <img th:src="@{/assets/images/instagram/instagram_04.jpg}" alt="">
                                        </div>


                                        <div class="instagram-widget__item col-xs-4">
                                            <img th:src="@{/assets/images/instagram/instagram_05.jpg}" alt="">
                                        </div>


                                        <div class="instagram-widget__item col-xs-4">
                                            <img th:src="@{/assets/images/instagram/instagram_06.jpg}" alt="">
                                        </div>


                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="payment-methods t-center">
                            <span><img th:src="@{/assets/images/icons/payment/paypal.jpg}" alt=""></span>
                            <span><img th:src="@{/assets/images/icons/payment/visa.jpg}" alt=""></span>
                            <span><img th:src="@{/assets/images/icons/payment/mastercard.jpg}" alt=""></span>
                            <span><img th:src="@{/assets/images/icons/payment/discover.jpg}" alt=""></span>
                            <span><img th:src="@{/assets/images/icons/payment/american.jpg}" alt=""></span>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- –––––––––––––––[ FOOTER ]––––––––––––––– -->
        <div th:replace="commons/footer::public_footer"></div>
        <!-- –––––––––––––––[ END FOOTER ]––––––––––––––– -->

    </div>
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- END WRAPPER                               -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->


    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- BACK TO TOP                               -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <div id="backTop" class="back-top is-hidden-sm-down">
        <i class="fa fa-angle-up" aria-hidden="true"></i>
    </div>

    <div th:replace="commons/js/js_header_footer :: public_js1"></div>

</body>

</html>
